<template>
	<view>
		<!-- 上方导航栏 -->
		<mvBar :mysNavConfig="mysNavConfig" @onLeftClick="onLeftClick"></mvBar>
		<view class="album">
			<view class="album__avatar">
				<image src="/static/img/opinion.png" mode="" style="width: 32px;height: 32px;">
				</image>
			</view>
			<view class="album__content">
				<view style="margin: 10px 0px;">
					<text style="font-size: 17px;font-weight: bold; color: #3c9cff;">{{opinionmsg.title}}</text>
					<text style="float: right; margin:5px 25px 0 0; font-size: 14px;">{{opinionmsg.createdTime}}</text>
				</view>
				<view style="width: 98%; line-height: 22px;">
					<u--text margin="5px 0 10px 0" :text="opinionmsg.content"></u--text>
				</view>
				<u-album :urls="picUrls" rowCount='4'></u-album>
			</view>
		</view>
		<view class="album" style="margin-left: 60px;" v-if="opinionmsg.replyStatus==3">
			<view class="album__avatar">
				<image src="/static/img/veizuLogo.jpg" mode="" style="width: 30px;height: 30px;">
				</image>
			</view>
			<view class="album__content">
				<u--text margin="10px 0 10px 0" text="回复 : " type="primary" bold size="17"></u--text>
				<view style="width: 90%; line-height: 22px;">
					<u--text margin="5px 0 10px 0" :text="opinionmsg.reply">
					</u--text>
					<text style=" float: right; margin:5px 25px 0 0; font-size: 14px;">
						{{opinionmsg.updatedTime}}</text>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				mysNavConfig: {
					/* 占位开启  */
					navPadding: true,
					/* 背景 */
					bgColor: "#0055ff",
					/* 标题 （屏幕中心居中 两边图标中心居中使用slot center1） */
					navTitle: {
						text: "反馈详情",
						color: "#ffffff",
						fontSize: "20px", // px upx rpx
						fontWeight: "500", // 100 - 700
					},
					isCustomFn: true,
					btnType: "type2",
					type2Config: {
						// 左图标
						leftPath: "/static/img/back.png",
						// 右图标
						rightPath: "/static/img/home.png",
						// 圆角
						radius: "40rpx",
					}
				},
				userInfo: '',
				opinionid: '',
				opinionmsg: '',
				picUrls: ['']
			}
		},
		onLoad(value) {
			this.opinionid = value.opinionid
			this.userInfo = uni.getStorageSync('userInfo');
			this.getopinionmassage();
		},
		methods: {
			//获取意见详情
			getopinionmassage() {
				uni.request({
					url: getApp().globalData.serverAddress + this.$uri.Url_lookopinionmassage.replace(
						"{userRealId}",
						this.userInfo.userRealId).replace("{suggestionRealId}",
						this.opinionid),
					dataType: "json",
					method: "GET",
					success: (resData) => {
						this.opinionmsg = resData.data.data
						this.picUrls = [];
						for (var i = 0; i < this.opinionmsg.picUrl.length; i++) {
							this.picUrls.push(getApp().globalData.serverAddress + this.opinionmsg.picUrl[i]);
						}
					},
					fail: (resData) => {
						this.$utils.showToast(this, resData.data.msg, 'error', 1, '');
					},
					complete: () => {
						uni.hideLoading();
					}
				})
			},
			onLeftClick() {
				uni.redirectTo({
					url: '/pages/userCenter/opinionlist'
				})
			}
		}

	}
</script>

<style lang="scss">
	.album {
		margin: 20px;
		@include flex;
		align-items: flex-start;

		&__avatar {
			background-color: $u-bg-color;
			padding: 5px;
			border-radius: 3px;
		}

		&__content {
			margin-left: 10px;
			flex: 1;
		}
	}
</style>
